<template>
	<el-main class="bg table_wrap subject_score">
	  <!-- table头部检索 -->
	  <div class="div-form">
		<el-form
		  ref="ruleFormRef"
		  :model="formInline"
		  label-width="90px"
		  :style="{ width: '100%' }"
		  label-position="left"
		>
		<el-row class="rows row1">
				<el-col :xs="24" :sm="24" :lg="8" class="el_form_search_wrap">
					<el-form-item label="提交人">
						<el-input v-model="formInline.nickname"></el-input>
					</el-form-item>
				</el-col>

				<el-col :xs="24" :sm="24" :lg="8" class="el_form_search_wrap">
					<el-form-item label="评分状态" prop="score_state">
						<el-select v-model="formInline.score_state">
							<el-option value="" label="">请选择</el-option>
							<el-option value="0" label="未评分">未评分</el-option>
							<el-option value="1" label="已评分">已评分</el-option>
						</el-select>
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
	  </div>
	  <baseTable
		:tableColumns="columns"
		:requestApi="url_get_list"
		:isShowSelect="true"
		:imgflag="false"
		:vm="vm" 
		v-model:isRefresh="isRefresh"
		:otherParams="formInline"
		@handleSelectionChange="handleSelectionChange"
		@handleCurrentChangeNew="handleCurrentChangeNew"
	  >
		<!-- 头部按钮 -->
		<template #baseHeadFunt>
		  <el-button type="primary" @click="onSubmit">查询</el-button>
		  <el-button @click="onReset(true)">重置</el-button>
		  <el-button
			type="danger"
			class="search_btn_del"
			@click="delInfo()"
			>删除</el-button
		  >

		</template>
		<!-- table内操作 -->
		<template #baseTableFunt="{ scope }">
		  <el-button
		  v-if="scope.row['score_state']===1"
			type="primary"
			size="small"
			@click="router.push('./score_view?user_answer_id=' + scope.row.user_answer_id)"
			>查看</el-button
		  >
		  <el-button
		  v-else
			type="primary"
			size="small"
			@click="router.push('./score_view?user_answer_id=' + scope.row.user_answer_id)"
			>评分</el-button
		  >
		</template>
		<template #baseTableFunt2="{ scope }">
		  <el-button
		  v-if="scope['score_state']===1"
			type="primary"
			size="small"
			@click="router.push('./score_view?user_answer_id=' + scope.user_answer_id)"
			>查看</el-button
		  >
		  <el-button
		  v-else
			type="primary"
			size="small"
			@click="router.push('./score_view?user_answer_id=' + scope.user_answer_id)"
			>评分</el-button
		  >
		</template>
		<!-- 特殊表格内容 -->
		<template #tableContent="{ scope, column }">
			<span v-if="column.prop === 'score_state'">
				{{ scope.row["score_state"] ===1?"已评分":"未评分" }}
        </span>
			<span v-if="column.prop === 'create_time'">{{
          formatDate(scope.row.create_time)
        }}</span>
        <span v-if="column.prop === 'update_time'">{{
          formatDate(scope.row.update_time)
        }}</span>
		</template>
		<template #tableContent2="{ scope, column }">
			<span v-if="column.prop === 'score_state'">
				{{ column.label }}：{{ scope["score_state"] ===1?"已评分":"未评分" }}
        </span>
			<span v-if="column.prop === 'create_time'">{{ column.label }}：{{
          formatDate(scope.create_time)
        }}</span>
        <span v-if="column.prop === 'update_time'">{{ column.label }}：{{
          formatDate(scope.update_time)
        }}</span>
		</template>
	  </baseTable>
	</el-main>
  </template>
  <script setup>
  import { useRouter,useRoute } from "vue-router";
  let router = useRouter();
  let route = useRoute();
  import {
	$check_exam,
	$fullUrl,
	formatDate,
	$banseUrl,
	$check_action,
	$getUrlParams,
  } from "@/utils/utils.js";
  import { $post, $get } from "@/api/Api.js";
  import { Picture } from "@element-plus/icons-vue";
  import { ElMessage } from "element-plus";
  import { ref, toRefs, computed, onMounted } from "vue";
  import storageHelper from "@/libs/StorageHelper";
  let table = ref("user_answer");
  let exam_id = $getUrlParams().exam_id;
  let field = ref("user_answer_id");
  let url_get_list = ref("/api/user_answer/get_list");
  let url_del = ref("/api/user_answer/del?");
  let user_group = storageHelper.getUserInfo().user_group;
  let user_id = storageHelper.getUserInfo().user_id;
  let answered_list = ref([]);
  let vm=ref({
  id: "user_answer_id",
})
  // 列名
  const columns = [
	{ prop: "nickname", label: "提交人" },
	{ prop: "objective_score", label: "客观题得分" },
	{ prop: "subjective_score", label: "主观题得分" },
	{ prop: "score", label: "总分" },
	{ prop: "score_state", label: "评分状态" },
	{ prop: "create_time", label: "提交时间" },
	{ prop: "update_time", label: "评分时间" },
  ];
  // 刷新table
  let isRefresh = ref(false);
  
  //批量勾选数据
  let selectList = ref([]);
  //点击当前行数据
  let currentRowTableProduct = ref({});
  //表格勾选回调
  let handleSelectionChange = (val) => {
	selectList.value = val.map((item) => {
	  return item.user_answer_id;
	});
  };
  //点击当前行
  let handleCurrentChangeNew = (val) => {
	currentRowTableProduct.value = val;
  };
  // 批量删除
  let delInfo = () => {
	ElMessageBox.confirm("此操作将永久删除该文件, 是否继续?", "提示", {
	  confirmButtonText: "确定",
	  cancelButtonText: "取消",
	  type: "warning",
	})
	  .then(() => {
		selectList.value.map((item) => {
		  delFun(item);
		});
	  })
	  .catch(() => {
		ElMessage({
		  type: "info",
		  message: "取消操作",
		});
	  });
  };
  
  // 调用删除方法
  let delFun = (id) => {
	$get(url_del.value + "user_answer_id=" + id).then((json) => {
	  if (json.result) {
		ElMessage.success("删除成功");
	  } else if (json.error) {
		ElMessage.error(json.error);
	  }
	  isRefresh.value = true;
	});
  };
  
  let table_class = ({ row, column, rowIndex, columnIndex }) => {
	return "table_class";
  };
  // 头部搜索// 搜索
  let formInline = ref({
       exam_id: exam_id,
	   nickname:"",
	   score_state:""
  });
  // 搜索
  let onSubmit = () => {
	isRefresh.value = true;
  };
  
  // 重置
  let onReset = (refresh) => {
	formInline.value = {
    exam_id: exam_id,
	nickname:"",
	score_state:""
	};
	isRefresh.value = refresh;
  };

  onMounted(() => {
   

  });
  </script>
  <style lang="less" scoped>
  .div-form {
	padding: 10px;
  }
  </style>
  